<style scoped lang="less">
    @import "TalentsPage";
</style>

<template>
    <div class="talents-container">
        <div class="filter-block">
            <ul class="type">
                <li v-for="(item, index) in typeList" :key="index+'type'">
                    <div class="type-title">
                        {{item.name}}:
                    </div>
                    <ul class="type-list" v-if="item.name==='更多筛选'">
                        <li class="select-item" v-for="(i,j) in item.content" :key="j+'i'">
                             <el-select
                                     :placeholder="i.title"
                                     v-if="item.name==='更多筛选'"
                                     v-model="i.modal"
                             >
                                <el-option
                                        :key="index+'1'"
                                        :value="conItem"
                                        :label="conItem"
                                        v-for="(conItem, index) in i.value">
                                    {{conItem}}
                                </el-option>
                              </el-select>
                        </li>
                    </ul>
                    <ul class="type-list" v-else>
                        <li class="type-item" v-for="(i,j) in item.content" :key="j+'i'">
                          {{i}}
                        </li>
                    </ul>
                </li>
            </ul>
            <div class="selected">
                已经选择：
                <div class="selected-list" v-for="(item, index) in typeSelected" :key="index+'sel'">
                    {{item}}
                    <i class="el-icon-close" style="color: #ccc;"></i>
                </div>
                <el-button type="text" class="clear-select fr">
                    清空筛选条件
                </el-button >
            </div>
        </div>
        <div class="list-block">
            <div class="header">
                <div class="title">综合排序</div>
            </div>
            <ul class="resume-list">
                <li v-for="(item, index) in talentList" :key="index+'tal'">
                    <el-checkbox v-model="checked" class="check-btn fl"></el-checkbox>
                    <div class="avatar fl">
                        <img :src="item.avatar" alt="">
                    </div>
                    <div class="detail fl">
                        <div class="main-info">
                            <span class="info-name">{{item.name}}</span>
                            <img :src="item.detail.male==='男'?nanTag:nvTag" alt="">
                            <div class="info-most">
                                <span v-for="(infoItem, key) in item.detail" :key="key" class="most-item">
                                    {{infoItem}}
                                </span>
                            </div>
                            <span class="info-education">{{item.important}}</span>
                            <img src="../../assets/images/talentsPage/top.png" alt="" v-if="index===0">
                        </div>
                        <div class="state">
                            <span class="state-item" v-for="(stateItem, key) in item.applyState" :key="key">
                                {{stateItem}}
                            </span>
                        </div>
                        <div class="tag">
                            <span class="tags-block" v-for="(tagItem, index) in item.tags" :key="index+'tag'">{{tagItem}}</span>
                        </div>
                    </div>
                    <div class="collect fr">
                        <div class="collect-icon">
                            <i class="el-icon-star-on"></i>
                            收藏
                        </div>
                        <el-button class="download" icon="el-icon-download">下载简历</el-button>
                        <div class="update">1小时前发布</div>
                    </div>
                </li>
            </ul>
            <div class="paginate">
                <el-pagination
                        background
                        layout="prev, pager, next"
                        :total="200">
                </el-pagination>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "TalentsPage",
        data() {
            return {
                valueList:[{value0: ''}, {value1: ''},{value2: ''}, {value3: ''},{value4: ''}, {value5: ''},{value6: ''}, {value7: ''}],
                checked: '',
                currentPage4: 1,
                currentPage: 0,
                nanTag: require('@/assets/images/talentsPage/nan.png'),
                nvTag: require('@/assets/images/talentsPage/nv.png'),
                typeList: [
                    {
                        name: '工作经验',
                        content: ['不限','应届毕业生','1年以内','1-3年','3-5年','10年以上']
                    },  {
                        name: '简历标签',
                        content: ['不限','形象好','气质佳','能出差','很幽默','技术精悍','有亲和力','高学历','经验丰富',
                            '能加班','海归', '会开车','口才好','声音甜美','会应酬','诚实守信','外语好','性格开朗','有上进心','人脉广',
                            '知识丰富','才艺多'
                        ]
                    },  {
                        name: '更多筛选',
                        content: [
                            {
                                title: '性别',
                                value: ['男', '女'],
                                modal: ''
                            },{
                                title: '年龄',
                                value: ['20-29', '30-39'],
                                modal: ''
                            },{
                                title: '行业类别',
                                value: ['前端', '后台', '测试'],
                                modal: ''
                            },{
                                title: '所学专业',
                                value: ['理工', '文科'],
                                modal: ''
                            },{
                                title: '学历要求',
                                value: ['初中', '高中','大专', '本科'],
                                modal: ''
                            },{
                                title: '工作性质',
                                value: ['男', '女'],
                                modal: ''
                            },{
                                title: '期望薪资',
                                value: ['男', '女'],
                                modal: ''
                            },{
                                title: '更新时间',
                                modal: ''
                            }
                        ]
                    },
                ],
                typeSelected: ['小学', '5K-10K'],
                talentList: [
                    {
                        avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                        avatar: require('@/assets/images/talentsPage/avater_nv.png'),
                        name: '黄女士',
                        salary: '5K-10K',
                        detail: {
                            male: '女',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    },{
                         avatar: require('@/assets/images/talentsPage/avater_nav.png'),
                        name: '黄先生',
                        salary: '5K-10K',
                        detail: {
                            male: '男',
                            age: '28岁',
                            Education: '本科',
                            experience: '3-5年',
                            address: '广州惠州',
                        },
                        important: '小学数学/初中数学/高中数学',
                        applyState: {
                            type: '全职',
                            major: '专业：高等数学',
                            salary: '5K-10K',
                            remarks: '在职，观望有好的机会'
                        },
                        tags: ['能出差','能加班','形象好','气质佳','口才好']
                    }
                ],
            }
        },
        methods: {
            handleSizeChange(){},
            handleCurrentChange() {}
        }
    }
</script>